 <template>
  <div>
     <div>
      <p-form layout="inline" @keyup.enter.native="searchQuery">
        <p-row :gutter="24">
          <p-col :xl="8" :lg="7" :md="8" :sm="24">
            <p-form-item label="车间">
               <p-select   style="width: 180px" 
               v-model="active.workroomname"
               >
              <p-select-option 
              @change="workChange(value)"
                :key="value.workroomno"
                :value="value.workroomname"
                v-for="value in userInfo"
              >{{value.workroomname}}</p-select-option>
              </p-select>
            </p-form-item>
          </p-col>
          <p-col :xl="8" :lg="7" :md="8" :sm="24" >
            <p-form-item label="线体">
              <p-select   style="width: 180px" 
               v-model="activeList.linename">
              <p-select-option 
              :key="value.classno"
                :value="value.linename"
                v-for="value in lineList"
              >{{value.linename}}</p-select-option>
              </p-select>
            </p-form-item>
          </p-col>
          <p-col :xl="8" :lg="7" :md="8" :sm="24">
              <p-button type="primary" @click="searchQuery" icon="search">搜索</p-button>
          </p-col>
        </p-row>
      </p-form>
    </div>
    <!-- 借调详情Table   -->
    <p-table
      ref="table"
      size="middle"
      bordered
      rowKey="id"
      :columns="columns"
      :scroll="tableScroll"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type:'radio'}"
      @change="pageChange"
    >
      <template slot="operation" slot-scope="text,record">
        <a @click="handleChangeHuman(record)">释放</a>
      </template>

      <template slot="htmlSlot" slot-scope="text">
        <div v-html="text"></div>
      </template>
      <template slot="imgSlot" slot-scope="text">
        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此图片</span>
        <img
          v-else
          :src="getImgView(text)"
          height="25px"
          alt="图片不存在"
          style="max-width:80px;font-size: 12px;font-style: italic;"
        />
      </template>
      <template slot="fileSlot" slot-scope="text">
        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此文件</span>
        <p-button
          v-else
          :ghost="true"
          type="primary"
          icon="download"
          size="small"
          @click="uploadFile(text)"
        >下载</p-button>
      </template>

      <span slot="action" slot-scope="text, record">
        <a @click="handleEdit(record)">编辑</a>

        <p-divider type="vertical" />
        <p-dropdown>
          <a class="ant-dropdown-link">
            更多
            <p-icon type="down" />
          </a>
          <p-menu slot="overlay">
            <p-menu-item>
              <p-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                <a>删除</a>
              </p-popconfirm>
            </p-menu-item>
            <template
              v-if="cgButtonLinkList && cgButtonLinkList.length>0"
              v-for="(btnItem,btnIndex) in cgButtonLinkList"
            >
              <p-menu-item :key=" 'cgbtnLink'+btnIndex " v-if="showLinkButton(btnItem,record)">
                <a
                  href="javascript:void(0);"
                  @click="cgButtonLinkHandler(record,btnItem.buttonCode,btnItem.optType)"
                >
                  <p-icon v-if="btnItem.buttonIcon" :type="btnItem.buttonIcon" />
                  {{ btnItem.buttonName }}
                </a>
              </p-menu-item>
            </template>
          </p-menu>
        </p-dropdown>
      </span>
    </p-table>
  </div>
</template>  

<script>
import { postAction, getAction, deleteAction,putAction} from "@/api/manage";
import Vue from "vue";

export default {
  name: "",
  props:["userlist"],
  data() {
    return {
      // 默认车间
      active:"",
      activeList:'',
      dataSource:[],
      //id集合
      ids:[],
      EnhanceJS: "",
      cgButtonLinkList: [],
      cgButtonList: [],
      title: "", //存表名
      groupTag: [],
      queryInfo: [],
      code: "",
      // 表头
      columns: [],
      //列设置
      settingColumns: [],
      //列定义
      defColumns: [
        {
          title: "序号",
          dataIndex: "id",
          key: "rowIndex",
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          },
        },
        {
          title: "工号",
          dataIndex: "empno",
          key: "empno",
          // width: "40%",
          align: "center",
        },
        {
          title: "姓名",
          dataIndex: "name",
          key: "name",
          // width: "40%",
          align: "center",
        },

        {
          title: "借出线体",
          dataIndex: "lineLendname",
          key: "lineLendname",
          align: "center",
        },
        {
          title: "借入线体",
          dataIndex: "lineBorrowname",
          align: "center",
        },
         {
          title: "借调日期",
          dataIndex: "secondmentDate",
          key:"secondmentDate",
          align: "center",
          customRender: function (t) {
            let now=new Date(t)
            let year=now.getFullYear();  //取得4位数的年份
            let month=now.getMonth()+1;  //取得日期中的月份，其中0表示1月，11表示12月
            let date=now.getDate();      //返回日期月份中的天数（1到31）
            return year+"-"+month+"-"+date;
          },
        },
        //  {
        //   title: "技能",
        //   dataIndex: "",
        //   align: "center",
        //   customRender: function (t, r, index) {
        //     let text=""
        //     t.forEach(item=>{ text+=item.name+","})
        //     return text
        //   },
        // },
         {
          title: "岗位标记",
          dataIndex: "",
          align: "center",
        },
        
         {
          title: "操作",
          dataIndex: "operation",
          align: "center",
          scopedSlots: { customRender: "operation" },
        }
      ],
      /* 分页参数 */
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ["10", "20", "50"],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条";
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
      },
      url: {
        //分页获取人员借调列表
        list: "/mes-manufacture/mfStaffSecondment/list",
        //召回或者撤销
        back:"/mes-manufacture/mfStaffSecondment/cancel"
      },
    };
  },
  created() {
    this.initColumns();
    this.setdefColumns();
    this.initData()
  },
  mounted(){
    console.log(this.activeList.lineno)
    this.loadData();
  },
  methods: {
    initData(){
      this.active=this.userlist[0]
      this.userInfo=this.userlist
      this.activeList=this.userlist[0].lines[0]
      this.lineList=this.userlist[0].lines
    },
    workChange(val){
      this.activeList=val.lines[0]
      this.lineList=val.lines
    },
    //召回
    handleChangeHuman(row){
      // this.ids.push(row.id);
      // let idParams = {
      //   ids:row.id
      // };
      putAction(this.url.back,{ids:[row.id]}).then((res)=>{
        if(res.success){
          this.$message.success('释放成功');
          console.log('更新数据')
          this.loadData()
        }
        if(res.code===510){
          this.$message.warning('释放失败');
        }
      })
    },
  
    tableScroll: function () {
      if (this.columns.length > 13) {
        return { x: this.columns.length * 150 - 450 };
      }
    },
    setdefColumns() {
      if (this.columns.length > 13) {
        let arrLength = this.columns.length - 1;
        this.columns.forEach((item, index) => {
          item["width"] = 130;
        });
        this.columns[arrLength]["fixed"] = "right";
        this.columns[0]["fixed"] = "left";
        this.columns[1]["fixed"] = "left";
      }
    },
    initColumns() {
      //权限过滤（列权限控制时打开，修改第二个参数为授权码前缀）
      //this.defColumns = colAuthFilter(this.defColumns,'testdemo:');

      var key = this.$route.name + ":colsettings";
      let colSettings = Vue.ls.get(key);
      if (colSettings == null || colSettings == undefined) {
        let allSettingColumns = [];
        this.defColumns.forEach(function (item, i, array) {
          allSettingColumns.push(item.dataIndex);
        });
        this.settingColumns = allSettingColumns;
        this.columns = this.defColumns;
      } else {
        this.settingColumns = colSettings;
        const cols = this.defColumns.filter((item) => {
          if (item.key == "rowIndex" || item.dataIndex == "action") {
            return true;
          }
          if (colSettings.includes(item.dataIndex)) {
            return true;
          }
          return false;
        });
        this.columns = cols;
      }
    },

    //列设置更改事件
    onColSettingsChange(checkedValues) {
      var key = this.$route.name + ":colsettings";
      Vue.ls.set(key, checkedValues, 7 * 24 * 60 * 60 * 1000);
      this.settingColumns = checkedValues;
      const cols = this.defColumns.filter((item) => {
        if (item.key == "rowIndex" || item.dataIndex == "action") {
          return true;
        }
        if (this.settingColumns.includes(item.dataIndex)) {
          return true;
        }
        return false;
      });
      this.columns = cols;
    },
    onClearSelected() {
      this.selectedRowKeys = [];
      this.selectionRows = [];
      this.selectedMainId = "";
    },
    onSelectChange(selectedRowKeys, selectionRows) {
      this.$emit('obtainPeople',selectedRowKeys[0])
      this.selectedMainId = selectedRowKeys[0];
      this.selectedRowKeys = selectedRowKeys;
      this.selectionRows = selectionRows;
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error("请设置url.list属性!");
        return;
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1;
      }
      this.onClearSelected();
      var params = {
        pageNo: this.ipagination.current,
        limit: this.ipagination.pageSize,
        lineno:this.activeList.lineno,
        workroomno:this.active.workroomno
      }; //查询条件
      this.loading = true;
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          this.dataSource = res.data.records;
          this.ipagination.total = res.data.total;
        }
        if (res.code === 510) {
          this.$message.warning(res.msg);
        }
        this.loading = false;
      });
    },
    pageChange(selectedRowKeys,selectedRows){
      this.ipagination=selectedRowKeys
      this.loadData()
    }
    

  },
};
</script>
<style scoped lang="less">
</style>